<template>
	<div>
		<!-- 用户的信息 -->
		<div>
			<MyTable :tableData="tableData">
				 <template v-slot:title>
						用户的说明
				  </template>
				  <template v-slot:footer>
						一共有4条数据
				  </template>
				 
			</MyTable>
			<MyPage :pages="8" :current="current" @changeCurrent="changeCurrent"></MyPage>
			
			
		</div>


	</div>
</template>

<script>
	export default {
		name: 'User',
		data() {
			return {
				current:1,
				tableData:[
					{id:1,name:'孙思邈'},
					{id:2,name:'华佗'},
					{id:3,name:'扁鹊'},
					{id:4,name:'齐桓公'},
				]
			}
		},
		methods:{
			changeCurrent(selected){
				console.log("分页组件，切换了当前显示的页号",selected);
				
				//模式的是从后台重新查询数据，ajax
				this.tableData = [
					{id:1,name:'孙思邈'+selected},
						{id:2,name:'华佗'+selected},
						{id:3,name:'扁鹊'+selected},
						{id:4,name:'齐桓公'+selected}
				]
				
				
				
				
			}
		}

	}
</script>

<style>
</style>